<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"
    />
</head>

<body>

    <script type="text/javascript">

        function baseClass() {
            this.prototypeA = 'a'
            this.prototypeMethodA = function () {
                console.log('this is instanceMethod-A')
            }
            this.prototypeMethodB = function () {
                console.log('this is instanceMethod-B')
            }
        }
        baseClass.prototype.prototypeMethodA = function () {
            console.log('this is prototypeMethod-A')
        }
        baseClass.prototype.init = function () {
            console.log('init')
            return new baseClass()
        }
        baseClass.c=function(){
            console.log('ccc')
        }

        function extendClass() {
            this.prototypeA = 'extend-a'
            this.prototypeMethodA = function () {
                console.log('this is instance-extend-Method-->' + this.prototypeA)
            }
        }
        extendClass.prototypeMethodB = function () {
            console.log(this)
            console.log('expectMethod' + this.prototypeA)
        }

        extendClass.prototype = new baseClass()
        var base = new baseClass()
        var base1 = new baseClass()
        console.log(base)
        console.log(base1)

        base.prototypeMethodA()
        baseClass.c()
        var instance = new extendClass()

        instance.prototypeMethodA()
        instance.prototypeMethodB()
        extendClass.prototypeMethodB()

        base.prototypeMethodA.call(instance)


    </script>

</body>

</html>